<template>
	<view class="address-content">
		<view class="address-add">
			<view class="address-title"><tui-icon name="addressbook" color="#00aaff"></tui-icon>
			<span>填写地址信息</span></view>
			<tui-form ref="add-form" v-model="addressInfo">
				<tui-input label="地址" :lineLeft="false" placeholder="请选择地址"
				   disabled @click="chooseAddress"
				   v-model="addressInfo.address"></tui-input>
				<tui-textarea label="门牌号" flexStart  height="25rpx"  placeholder="请输入门牌号" v-model="addressInfo.detailAddress"></tui-textarea>
				<tui-input label="联系人" :lineLeft="false" placeholder="请输入联系人" v-model="addressInfo.linkman"></tui-input>
				<tui-input label="联系电话" :lineLeft="false" placeholder="请输入联系电话" v-model="addressInfo.linkphone"></tui-input>
				<tui-button type="primary" :loading="loading" :disabled="loading" @click="submit">保存</tui-button>
			</tui-form>
		</view>
		<view class="address-list">
			<view class="address-title">常用地址</view>
			<view class="address-list-content"  v-for="(item, index) in addressList" :key="index">
				<view class="address-item" @click="getAddress(item)">
					<span>{{item.address}}</span>
					<span>{{item.linkman}} &nbsp;&nbsp; {{item.linkphone}}</span>
				</view>
				<view class="address-edit">
					<tui-icon name="edit" @click="editAddress(item)"></tui-icon>
				</view>
			</view>
		</view>
		<tui-toast ref="toast"></tui-toast>
	</view>
</template>

<script>
export default {
	data(){
		return {
			addressInfo: {
				address: '',
				detailAddress: '',
				xLocation: 120,
				yLocation: 140,
				linkman: '',
				linkphone: ''
			},
			addressList: [],
			item: '',
			loading: false
		}
	},
	onLoad(options){
		this.item = options.item;
		this.myAddress();
		let userInfo = uni.getStorageSync("user_info");
		this.addressInfo.linkman = userInfo.nickname;
		this.addressInfo.linkphone = userInfo.mobile;
	},
	methods: {
		chooseAddress(){
			uni.navigateTo({
				url: '/pages/community/orders/address/location'
			})
		},
		myAddress(){
			this.$api.getMyAddress().then(res => {
				if(res.success){
					this.addressList = res.result;
				}
			})
		},
		setAddress(data){
			this.addressInfo.address = data.title;
			this.addressInfo.detailAddress = data.address;
			this.addressInfo.xLocation = data.xLocation;
			this.addressInfo.yLocation = data.yLocation;
		},
		submit(){
			this.loading = true;
			if(this.valide(this.addressInfo)){
				this.$api.addOrEditAddress(this.addressInfo).then(res => {
					this.loading = false;
					if(res.success){
						this.myAddress();
						this.$refs.toast && this.$refs.toast.show({
							title: '保存成功',
							icon: false
						});
					}
				})
			}else{
				this.loading = false;
			}
			
		},
		editAddress(item){
			this.addressInfo = item;
		},
		getAddress(data){
			let page = getCurrentPages();
			let prevPage = page[page.length-2];
			prevPage.$vm.setAddress(data, this.item);
			uni.navigateBack({delta: 1});
		},
		valide(data){
			let flag = true;
			let msg = '';
			if(data.address == ''){
				flag = false;
				msg = '请选择地址';
			}
			if(data.detailAddress == ''){
				flag = false;
				msg = '请输入门牌号';
			}
			
			if(data.linkman == ''){
				flag = false;
				msg = '请输入联系人';
			}
			if(data.linkphone == ''){
				flag = false;
				msg = '请输入联系电话';
			}
			if(!flag){
				let params = {
					title: msg,
					icon: false
				}
				this.$refs.toast && this.$refs.toast.show(params);
			}
			
			return flag;
		}
	}
}
</script>

<style lang="scss">
	@import url("address.css");
</style>